<template>
			<view >
				<view >
					<u-subsection :list="subsectionList" :current="tabIndex" @change="sectionChange"></u-subsection>
				</view>
				<swiper class="container__sticky__swiperbox" :current="tabIndex" @change="onswiperchange" >
					<swiper-item class="swiper-item" v-for="(item,inx) in drawprize" :key="inx" >
						<view class="container__sticky__swiperbox__draw-ul">
							<view class="container__sticky__swiperbox__draw-ul__title"><text>{{item.issue}}期：</text>
								<view class="text-right container__sticky__swiperbox__draw-ul__more" @click="checkRoute('pages/index/drawprize',{'alias':item.alias})">历史记录<u-icon name="arrow-right-double" size="14"  style="float:right;font-weight: bold;"></u-icon></view>
							</view>
							<template v-for="(vl,vk) in item.open_code">
								<view :key="vk">
									<view  v-if="vk===6" class="container__sticky__swiperbox__draw-ul__li container__sticky__swiperbox__draw-ul__jia">
										+
									</view>
									<view class="container__sticky__swiperbox__draw-ul__li" >
										<view><view class="container__sticky__swiperbox__draw-ul__li__code" :class="'nub-color-'+vl.color">{{vl.nub}}</view></view>
										<view>{{vl.title}}</view>
									</view>
								</view>
							</template>
							
						</view>
					</swiper-item>
				</swiper>
			</view>
</template>

<script>
	export default {
		props:{
			subsectionList:{
				type:Array,
				default : ()=>{
					return []
				}
			},
			drawprize:{
				type:Array,
				default : ()=>{
					return []
				}
			}
		},
		data() {
			return {
				tabIndex:0
			}
		},
		methods: {
			sectionChange(e){
				this.tabIndex = e;
			},
			onswiperchange(e){
				this.tabIndex = e.detail.current;
			},
			checkRoute(_url,_params={}){
				uni.$u.route({
					url:_url,
					params:_params
				});
			}
		}
	}
</script>

<style lang="scss">
.container{
	&__sticky{
		background-color: #ffffff;
		border-bottom: 1px solid #C0C0C0;
		margin-bottom: 10rpx;
		border-bottom-left-radius: 20rpx; /*左上角*/
		border-bottom-right-radius: 20rpx; /*右上角*/
		// top: 0 !important;
		&__swiperbox{
			height: 170rpx;
			background-color: #ffffff;
			&__draw-ul{
				height:150rpx;
				&__title{
					font-weight: bold;
					font-size: 28rpx;
					margin: 10rpx ;
				}
				&__more{
					font-size: 22rpx;
					float:right;
				}
				&__jia{
					font-size: 40rpx;
					line-height: 75rpx;
				}
				&__li{
					width:12.5%;
					text-align: center;
					font-weight: bold;
					float: left;
					&__code{
						width: 50rpx;
						height: 50rpx;
						border-radius: 100%;
						margin: 0 auto;
						color:#FFFFFF;
						line-height: 50rpx;
						font-size: 28rpx;
					}
				}
			}
		}
	}
	
}
</style>
